<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>swan</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width">
        <script src="../../bower_components/angular/angular.js"></script>
        <script src="../../assets/js/city.min.js"></script>
        <script src="../../bower_components/ng-file-upload/ng-file-upload-shim.min.js"></script>
        <script src="../../bower_components/ng-file-upload/ng-file-upload.min.js"></script>
        <style>
            .animate-fade.ng-enter {
                transition:0.5s linear all;
                -webkit-transition:0.5s linear all ;
                opacity:0;
            }
            .animate-fade.ng-enter.ng-enter-active {
                opacity:1;
            }
            .animate-fade.ng-leave {
                transition:0.5s linear all;
                -webkit-transition:0.5s linear all ;
                opacity:1;
            }
            .animate-fade.ng-leave.ng-leave-active {
                opacity:0;
            }
    </style>
        <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular-animate.min.js"></script>
        <script src="test.js"></script>
    </head>
    <body ng-app="Test">
    <div ng-if="bool" class="animate-fade">
        Fade me in out
    </div>
    <button ng-click="bool=true">Fade In!</button>
    <button ng-click="bool=false">Fade Out!</button>
    </body>
    <script>
        var app = angular.module('Test', ['ngAnimate']);
    </script>

</html>
